<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>详情页</title>
    <link rel="stylesheet" href="/css/details.css">
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/lib/font/iconfont.css">
    <link rel="stylesheet" href="/lib/font1/iconfont.css">


</head>

<body>
    <header>

    </header>

    <!-- body-main -->
    <!-- tou -->
    <div id="dbms">
        <div class="ds">
            <ul>
                <li>
                    <a href="/index.html">首页 > </a>
                </li>
        
                <li>
                    <a href="">姜小虎周边专区 > </a>
                </li>
    
                <li>
                    <a href="">姜小虎系列周边 > </a>
                </li>
       
                <li>
                    <a href="">姜小虎-货郎小虎手办</a>
                </li>
            </ul>
        </div>
    </div>


    <!-- shen -->
    <div id="dbmb">
        
    </div>

    <!-- 定义详情页购物车部分模板 -->
    <script type="text/html" id=detailsTemplate>
    <div class="db">
            <div class="db-l">
                <div class="bigimg">
                    <img src="{{image}}" alt="" class="zoom-image">
                </div>
                <div class="smallimg" id="smallimg">
                    <ul>
                        {{each photo item}}
                           <li>
                              <a href="" data-image="{{item.url}} "data-zoom-image="{{item.url}}">
                                    <img src="{{item.url}}" alt="">
                              </a>
                           </li>
                        {{/each}}
                    </ul>
                </div>
                <span>
                    关注 4
                </span>
            </div>
            <div class="db-r">
                <div class="r-box">
                    <div class="box1">
                        <h1>{{title}}</h1>
                        <p>正版姜小虎 手办 完美10周年纪念款</p>
                    </div>
                    <div class="box2">
                        <p>￥{{price}}</p>
                    </div>
                    <div class="box3">
                        <div class="b3-1">
                            <p>运费：</p>
                            <span1>北京 至</span1>
                            <select>
                                <option>北京</option>
                                <option>贵州</option>
                                <option>四川</option>
                                <option>黑龙江</option>
                            </select>
                            <span2>
                                快递：
                            </span2>
                            <span3>￥15.00</span3>
                        </div>
                        <div class="b3-2">
                            <p> 数量：</p>
                            <div class="count">
                                <div class="num_left">
                                    <a href="">-</a>
                                </div>
                                <div>
                                    <input type="text" value="1"  class="num_mid">
                                </div>
                                <div class="num_right">
                                    <a href="">+</a>
                                </div>
                            </div>
                            <span1>(库存84件)</span1>
                            <span2>已售出
                                <span>16</span>
                                件</span2>
                        </div>
                    </div>
                    <div class="box4">
                        <div class="b4-1">
                            <p>
                                <a href="javascript:void(1);" class="addBtn1">立即购买</a>
                            </p>
                        </div>
                        <div class="b4-2">
                            <p>
                                <a href="javascript:void(0);" class="addBtn">加入购物车</a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    
    
    </script>
<div class="loading">
    亲，加入成功喽~~~
</div>

<div class="gm">
    购买成功！
</div>

    <!-- jiao -->
    <div id="dbmf">
        <div class="df">
            <!-- zuo -->
            <div class="fdf">
                <dl>
                    <dt>猜你喜欢</dt>
                    <dd>
                        <a href="">
                            <img src="/images/WMSC/a917a3be22b9471a83e34c58df61f375_120.jpg" alt="诛仙3-纯银镀金合欢铃" title="">
                        </a>
                        <p>诛仙3-纯银镀金合欢铃</p>
                        <p>￥168.00</p>
                    </dd>
                    <dd>
                        <a href="">
                            <img src="/images/WMSC/6fe6bd198dbd45888014c2a43325120e_120.jpg" alt="诛仙3-全职业鼠标垫铃" title="">
                        </a>
                        <p>诛仙3-全职业鼠标垫</p>
                        <p>￥68.00</p>
                    </dd>
                    <dd>
                        <a href="">
                            <img src="/images/WMSC/0e2c7160-ea19-432b-9817-c024f3f5e33f_120.jpg" alt="姜小虎-抱腿腰包" title="">
                        </a>
                        <p>姜小虎-抱腿腰包</p>
                        <p>￥99.00</p>
                    </dd>
                    <dd>
                        <a href="">
                            <img src="/images/WMSC/6e1db378ad16460c817c6d6a6ebd42d1_120.jpg" alt="CS.GO 网络棒球帽" title="">
                        </a>
                        <p>CS.GO 网络棒球帽</p>
                        <p>￥239.00</p>
                    </dd>
                    <dd>
                        <a href="">
                            <img src="/images/WMSC/9c937b4a-de48-4eff-b7a6-2283cb490852_120.jpg" alt="粘土人 痛苦女王 T17周边预警限时特价" title="">
                        </a>
                        <p>粘土人 痛苦女王 T17周边预警限时特价</p>
                        <p>￥298.00</p>
                    </dd>
                </dl>
            </div>


            <!-- you -->
            <div class="rdf">
                <ul>
                    <li>
                        <a href="">商品介绍</a>
                    </li>
                    <li>
                        <a href="">产品评论
                            <span>(1) </span>
                        </a>
                    </li>
                </ul>
                <div class="xq">
               
                </div>
    </div>
 </div>
</div>

<script src="/lib/require/require.js" data-main="/js/details"></script>


<!-- 定义详情页下面的图片说明 -->
      <script type="text/html" id="detailsXqTemplate">
          {{each list item}}
          <p><img src="{{item.image.url}}" alt=""></p>
          {{/each}}
    </script>




   <footer>

   </footer>




</body>

</html>